<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>省市二级联动</title>
</head>
<body>
    <select id="province">
        <option>--请选择--</option>
        <option value="0">江西省</option>
        <option value="1">浙江省</option>
        <option value="2">江苏省</option>
        <option value="3">台湾省</option>
    </select>
    <select id="city">
        <option>---请选择-</option>
    </select>
</body>
<script type="text/javascript">
    var provices=[
        ["南昌市","九江市","赣州市"],
        ["杭州市","宁波市","温州市","嘉兴市"],
        ["南京市","苏州市","扬州市"],
        ["台北市","台中市","台南市"]
    ];


    /*
    * 每次更改选项时清楚之前的数据
    * */
   /* function rem(){
       let ele= document.getElementById("city");
       let eles=ele.getElementsByTagName("option");
       //清除保留第一个
        for (let i = 1; i < eles.length;) {
            ele.removeChild(eles[i]);
        }
    }*/

    document.getElementById("province").onchange=function () {
        let ele=document.getElementById("city")
        ele.innerHTML="<option>" + "--请选择--" + "</option>";

        // rem();
        let arr=provices[this.value];

        for (let i=0;i<arr.length;i++){
            ele.innerHTML+="<option>"+arr[i]+"</optino>"
           /* let option=document.createElement("option")
            option.innerText=arr[i];
            ele.appendChild(option);*/
            // ele.innerHTML="<option>"+provices[j]+"</option>"
        }
    }




</script>
</html>